<script setup>
import { reactive} from 'vue'
import ProductItem from './ProductItem.vue';

const productList = reactive({
    list:[
        {id:1,productName:'iPhone X',productPrice:"9999.99",productImg:"https://picsum.photos/id/23/200/300",dazhe:6.7,productComment:200},
        {id:2,productName:'iPhone X',productPrice:"9999.99",productImg:"https://picsum.photos/id/27/200/300",dazhe:5.7,productComment:200},
        {id:3,productName:'iPhone X',productPrice:"9999.99",productImg:"https://picsum.photos/id/29/200/300",dazhe:8.7,productComment:400},
    ]
})


const handleTestDemo = ()=>{
    console.log("trigger test demo event");
    
}


</script>

<template>
<div>
    <ProductItem @test-demo="handleTestDemo" v-for="item in productList.list" :key="item.id" :product="item">


        <h1>我是H1</h1>
    </ProductItem>


    <!-- <button @click="handleClick">btn</button> -->
     <div>
        sdkfsdkf
     </div>

</div>
</template>

<style scoped>
</style>